<template>
  <div class="container">
    <div class="banner">
      <img src="../assets/images/applicationCases/back.jpg" alt="" />
      <div class="title">应用案例</div>
    </div>
    <h2><span>数字农业</span>综合解决方案</h2>
    <P>
      基于自主可控的数字李生技术、物联管控技术、云计算、人工智能、数据挖掘、边缘计算、GIS遥感监测、增强现实等
    </P>
    <P
      >多种技术手段融合，构建全流程的新型农业一体化管理平台，围绕产运销管理全流程，实现生产->存储->包装->运输->销售的全链条管理。
      融合农业数据管理、农业数据预警显示、多维数据综合显示、农产品生产周期预测、农业气象预警、信息综合利用、信息发布服务、病虫害
      预警、溯源系统等功能与数据为一体，提供全方位、智慧化、立体、可视化的运营保障服务。</P
    >
    <hr />
    <home-bottom-banner class="bottom-banner"></home-bottom-banner>
  </div>
</template>

<script>
import HomeBottomBanner from "../components/Home/HomeBottomBanner";
export default {
  name: "ApplicationCases",
  components: {
    HomeBottomBanner,
  },
};
</script>

<style lang="less" scoped>
.container {
  text-align: center;
  .banner {
    margin: 0 0 80px 0;
    display: flex;
    align-items: center;
    position: relative;
    width: 100%;
    height: calc(100vh - 180px);
    img {
      position: absolute;
      width: 100%;
      height: 100%;
    }
    .title {
      display: flex;
      align-items: center;
      padding-left: 40px;
      z-index: 2;
      color: #fff;
      font-weight: 700;
      font-size: 45px;
      letter-spacing: 8px;
      width: 700px;
      height: 300px;
      background-image: linear-gradient(
        to right,
        rgba(255, 255, 255, 0.4),
        rgba(255, 255, 255, 0)
      );
    }
  }
  h2 {
    margin: 30px 0;
    font-size: 36px;
    font-weight: 900;
    letter-spacing: 7.2px;
    span {
      color: #31c46c;
    }
  }
  p {
    color: #8c8c8cff;
    font-size: 15px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 3.6px;
  }
  .bottom-banner {
    margin-top: 150px;
  }
}
</style>
